<template>
	<view>
		<!-- #ifdef MP -->
		<view class="flex align-center fixed-top bg-white" style="height: 44px;">
			<!-- 搜索框 -->
			<view class="ml-2 flex align-center flex-1 rounded-circle px-1"
				style="height: 40px; background-color: #F6F7F8;color: #959FA0;">
				<image :src="Domain_ICON +' /search.png'" mode="" style="margin-right: 8px; width: 25px; height: 25px;"></image>
				<input v-model="InputValue" type="text" @input="onKeyInput" placeholder-class="font" placeholder="请输入内容">
			</view>
			<view class="flex align-center px-2 font-md" @click="GoGoods()">搜索</view>
		</view>
		<view style="height: 44px;"></view>
		<!-- #endif -->
		<view class="mx-2 mt-4" style="position:relative;">
			<view class="font-md font-weight-bold">搜索历史</view>
			<text @click="clear" class="font-sm text-muted" style="position: absolute; right: 0; top: 10rpx;">清空</text>
			<view class="flex flex-wrap py-2">
				<text @click="GoGood(index)" :class="index+1%4==0?'':'mr-2'" class="py-2 px-4 mb-2 rounded-circle font-sm text-center text-ellipsis" v-for="(item,index) in history" :key="index"
					style="display: inline-block; width: 70rpx; background-color: #F6F7F8;">{{item}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	const app = getApp()
	import times from '@/mixins/time.js'
	export default {
		data() {
			return {
				history:[],//历史记录
				InputValue:'',
				isloading:true,
				form:{//提交的关键字表单
					Member_Search_SerialNumber:'',
					Search_Keywords:'',//关键字
					Search_Date:'',//搜索关键字的日期
					Open_ID:app.globalData.openid,
					App_ID:app.globalData.appid,
					Enterprise_Info_SerialNumber:app.globalData.enterprise,
					Domain_ICON: app.globalData.Domain_ICON, //全局变量域名
				}
			}
		},
		methods: {
			GoGoods(){
				if(this.InputValue==''){
					uni.showToast({
						title:'请输入您要查询的关键字',
						icon:'none'
					})
					return
				}
				//每次拿到的关键字存入数据库
				this.form.Search_Date = times.nowtime()
				this.form.Search_Keywords = this.InputValue
				console.log(this.form.Search_Keywords)
				uni.request({
					header: {
						'Content-Type': 'application/x-www-form-urlencoded'
					},
					url: app.globalData.Domain_Name + '/WXAddAction', //添加关键字
					method: "POST",
					data: { Data:JSON.stringify({member_search_info:[this.form]}),Open_ID:app.globalData.openid},
					success: (res) => {
						console.log(res)
					}
				})
				uni.navigateTo({
					url:'/pages/index/goods?key='+this.InputValue
				})
			},
			GoGood(index){
				this.InputValue = this.history[index]
				this.GoGoods()
			},
			onKeyInput(e){
				this.InputValue = e.detail.value
			},
			//清空本地存储跟页面的搜索记录
			clear(){
				uni.setStorageSync('UserSearchforRecords',[])
				this.history = []
			}
		},
		onShow() {
			this.history = uni.getStorageSync('UserSearchforRecords')
		}
	}
</script>

<style>

</style>
